* {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
:root {
  --main-txt-size: calc(14px + (28 - 14) * ((100vw - 800px) / (1400 - 800)));
  --main-txt-size-min: 14px;
  --main-txt-size-max: 22px;
  --main-txt-line-height: 1.5em;
  --txt-line-height-small: 1.4vw;
  --win-min-break: 800px;
  --win-max-break: 1400px;
}
html {
  margin: 0;
  padding: 0;
  font-family: Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.5em;
  font-weight: normal;
  font-style: normal;
  font-kerning: auto;
  color: black;
  background-color: white;
  scroll-behavior: smooth;
}

  html {box-sizing: border-box;}
*, *:before, *:after {box-sizing: inherit;}

h1 {
  font-family: Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.5em;
}

body {
  height: 100%;
  height: 100vh;
  line-height: 1;
  overflow-x: hidden;
  overflow-y: hidden;
  font-family: helvetica, sans-serif;
  font-weight: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* DREIECK/TEXT */
div {
  shape-outside: polygon(0 0, 0 100%, 100% 100%);
  width: 100%;
  height: 100%;
  float: left;
}

h1:hover {
  animation: shake 0.5s; 
  animation-iteration-count: infinite; 
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}